<template>
 <div>
    <el-form-item :label="+(index )+'、单图：'">
      <my-ldyUpload
        :data="bgData"
        @reUrlData="getBgUrl"
        @delData="delUrl"
        ref="upload"
        ></my-ldyUpload>
    </el-form-item>
    <el-form-item label="单图链接："   v-if="src">
      <el-button type="primary" size="mini"><a target="_blank" :href="src">点击查看</a></el-button>
      <el-button
        size="mini"
        type="primary"
        v-clipboard:copy="src"
        v-clipboard:success="onCopy"
        v-clipboard:error="onError"
      >
        复制链接
      </el-button>
    </el-form-item>
   <div v-if="src">
     <el-button type="primary" @click="sure()" style="float:right;">确定</el-button>
   </div>
 </div>
</template>
<script>
  import ldyUpload from "@/views/market/ldy/ldyUpload.vue";
export default {
//  props: {
//    item: {
//      type: Object,
//      default() {
//        return {};
//      }
//    },
//    index: {
//        type: Number,
//        required: true
//    },
//  },
  props: ["index"],
  data() {
    return {
      flag: false,
      src: "",
      bgData:{
        limit: 1,
        tips:'只能上传jpg/png文件，宽750px',
        num:'',
      },
      imgData:{
         "index": "",
         "module_type": "2",//1顶部图,2单图，3视频，4轮播，
         "resource_url": "",
       }

    };
  },
  computed: {

  },
  components: {
    "my-ldyUpload": ldyUpload,
  },
  mounted() {
    this.bgData.num=this.index;
    this.imgData.resource_url="";
  },
  methods: {
    getBgUrl(data) {
       //console.log(data);
       //console.log(this.item.num);
       this.imgData.index=this.index;
       this.imgData.resource_url=data;
       this.src=data;
       //console.log(this.imgData);

    },
    delUrl(){
      this.src="";
    },
    // 确定
    sure() {
      this.$emit("getUrl", this.imgData);
      this.$nextTick(() => {
        //console.log(this.$refs.upload.fileList);
        this.$refs.upload.fileList=[];
        //console.log(this.$refs.upload.fileList)
        this.src="";
       })
    },
    // 复制链接方法
    onCopy(e) {
      this.$message.success("复制成功");
    },
    onError(e) {
      this.$message.warning("该浏览器不支持自动复制");
    },
  },
};
</script>
<style lang='stylus' scoped>
a{
  text-decoration: none;
  color: #fff;
}
</style>
